{% extends "@XiaoZhu/base/frame.html.twig" %}

{% block content_header %}
{% endblock %}

{% block content_main %}
    <div class="main">
        <div class="container">
            <div class="col-md-12 col-sm-12">
                <h1>用户中心</h1>
                <div class="content-page">
                    <div class="row">
                        <div class="col-md-2">
                            <h4>总览</h4>
                            <ul class="list-unstyled">
                                <li class="current"><i class="fa fa-angle-right"></i> <a href="{{ path("AccCenter") }}">小主首页</a></li>
                            </ul>
                            <h4>订单管理</h4>
                            <ul class="list-unstyled">
                                <li><i class="fa fa-angle-right"></i> <a href="#">全部订单</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="#">待付款</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="#">代收货</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="#">待评价</a></li>
                            </ul>
                            <h4>个人设置</h4>
                            <ul class="list-unstyled">
                                <li><i class="fa fa-angle-right"></i> <a href="{{ path("AccBaseInfo") }}">基本资料</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="#">修改头像</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="{{ path("AccPassword") }}">修改密码</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="#">收货地址</a></li>
                            </ul>
                            <h4>私人空间</h4>
                            <ul class="list-unstyled">
                                <li><i class="fa fa-angle-right"></i> <a href="#">我的钱包</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="#">我的收藏</a></li>
                                <li><i class="fa fa-angle-right"></i> <a href="#">我的消息</a></li>
                            </ul>
                        </div>
                        <div class="col-md-10">
                            {#start:用户简略信息#}
                            {% block shortCut %}
                                用户简要信息
                            {% endblock %}
                            {#end:用户简略信息#}
                            {#start:最新订单#}
                            {% block accCenterMain %}
                            <div class="col-md-12">
                                <div class="col-md-9">
                                    {% block accCenterMainLeft %}
                                        主要内容左侧部分
                                    {% endblock %}
                                </div>
                                <div class="col-md-3 sidebar-products clearfix">
                                    {% block accCenterMainRight %}
                                        主要内容右侧部分
                                    {% endblock %}
                                </div>
                            </div>
                            {% endblock %}
                            {#start:最新订单#}
                        </div>
                    </div>
                </div>
            </div>
            <!-- END CONTENT -->
        </div>
    </div>
{% endblock %}

{% block content_footer %}
    <style>
        .current{color: #e84d1c}
        .current a {color: #e84d1c ;font-weight: bold;}
        .sub_title{ height: 40px;border-bottom: 1px solid #ccc;padding-left: 3px;margin-top: 20px;}
        /*用户信息栏*/
        .user_short_cut{}
        .user_short_cut .user_short_cut_head{ width: 100px;height: 100px; border-radius: 100px !important; overflow: hidden;float: left;}
        .user_short_cut .user_short_cut_head img{ width: 100px;height: 100px;border-radius: 100px !important;}
        .user_short_cut .user_short_cut_info{ height: 28px;line-height: 24px;float: left;padding-left: 20px;}
        .user_short_cut .user_short_cut_info span{color: #e84d1c ;}
        .user_short_cut_orders {height: 100px; border-left: 1px dotted #CCC;}
        .user_short_cut_orders .num{width: 60px;height: 60px;
            border-radius: 60px !important; margin: 0 auto;
            font-size: 28px;line-height: 60px;text-align: center;
            cursor: pointer;
            border: #e84d1c 1px solid;color: #e84d1c;}
        .user_short_cut_orders .text{height: 40px;line-height: 40px;text-align: center;}

        /*默认收货地址*/
        .address{height: 28px;line-height: 28px;margin-top: 20px;border-top:1px solid #EEE;border-bottom:1px solid #EEE;}

        /*订单栏*/
        .my_orders{padding: 5px 20px;}
        .my_orders .row{}
        .my_orders .row .head_line{border-bottom: 1px dashed #DDD;padding: 15px 0 5px 0;}
        .my_orders .row .head_line .sn{font-weight: bold;}
        .my_orders .row .head_line .status{ float: right;padding: 3px;border: 1px solid #EEE;border-radius: 3px !important;}
        .my_orders .row .products{border-bottom: 1px dotted #EEE;line-height: 24px;padding: 5px 0;}
        .my_orders .row .products a{cursor: pointer;}
        .my_orders .row .sum{padding: 5px 10px;background: #F9F9F9}
        .my_orders .row .sum .num{ }
        .my_orders .row .sum .total{ float: right;}
        .my_orders .row .sum .total span,.my_orders .row .sum .num span{color: #e84d1c;font-size: 18px;}

        /*右侧商品*/
        .sidebar-products h2,.main_content h2{border-left: 4px solid #e84d1c;padding:5px 6px;background: #F9F9F9;font-size: 18px;}
    </style>
{% endblock %}
